<template>
    <van-icon :color="value ? '#ffa500' : ''" :name="value ? 'star' : 'star-o'" @click="onCollect" />
</template>

<script>

import {addCollect ,deleteCollect} from '@/api/article'
export default {
    name: 'CollectArticle',
    mixins: [],
    components: {},
    props: {
        value: {
            // type: Boolean,
            required: true
        },
        articleId: {
            // type: [Number, String, Object],
            required: true
        }
    },
    data() {
        return {
        }
    },
    computed: {},
    watch: {},
    created() { },
    mounted() { },
    methods: {
        async onCollect() {
            this.$toast.loading({
                duration:0,
                message:'',
                forbidClick:true  //是否禁止背景点击
            })
            try{
                if(this.value){
                    //已完成
                    await deleteCollect(this.articleId)
                }else{
                    // 没有收藏
                    await addCollect(this.articleId)
                }
                this.$emit('input',!this.value)
                // 收藏成功以后的提示
                this.$toast.success(!this.value ?'收藏成功':'取消收藏')
            }catch(err){
                this.$toast('操作失败，请重试')
                console.log(err);
            }
        }
    }
}
</script>

<style scoped lang="less">

</style>